/**
 * Flexible Box Model
 * ---------------------
 * HGroup, VGroup
 * HBox, VBox
 * >>>> HBox, VBox
 * ---------------------
 * References: 
 * http://infrequently.org/2009/08/css-3-progress/
 * http://stackoverflow.com/questions/4465264/css3-flexible-box-model-and-nested-layouts
 **/

/* Box container */
.HBox, .VBox, .HBox > .HBox, .HBox > .VBox, .VBox > .HBox, .VBox > .VBox
{
	display: -webkit-box;
	-webkit-box-align: stretch;
 
	display: -moz-box;
	-moz-box-align: stretch;
 
	display: box;
	box-align: stretch;
}

/* Horizontal boxes */
.HBox
{
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	box-orient: horizontal;
}

/* Vertical boxes */
.VBox
{
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	box-orient: vertical;
}

/* Elements of boxes */
.HBox > *, .VBox > *
{
	-webkit-box-flex: 0;
	-moz-box-flex: 0;
	box-flex: 0;
	display: block;
}

/* Util */
.spacer
{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
}
 
.reverse 
{
	-webkit-box-direction: reverse;
	-moz-box-direction: reverse;
	box-direction: reverse;
}

/* Element fill space */
.boxFlex1, .boxFlex 
{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
}
 
.boxFlex2 
{
	-webkit-box-flex: 2;
	-moz-box-flex: 2;
	box-flex: 2;
}

/* HBox: aligment of elements */
.HBox.vstart
{
	-webkit-box-align: start;
	-moz-box-align: start;
	box-align: start;
}
 
.HBox.vend
{
	-webkit-box-align: end;
	-moz-box-align: end;
	box-align: end;
}
 
.HBox.vcenter
{
	-webkit-box-align: center;
	-moz-box-align: center;
	box-align: center;
}

.HBox.hstart
{
	-webkit-box-pack: start;
	-moz-box-pack: start;
	box-pack: start;
}

.HBox.hend
{
	-webkit-box-pack: end;
	-moz-box-pack: end;
	box-pack: end;
}

.HBox.hcenter
{
	-webkit-box-pack: center;
	-moz-box-pack: center;
	box-pack: center;
}

/* VBox: aligment of elements */
.VBox.hstart
{
	-webkit-box-align: start;
	-moz-box-align: start;
	box-align: start;
}
 
.VBox.hend
{
	-webkit-box-align: end;
	-moz-box-align: end;
	box-align: end;
}
 
.VBox.hcenter
{
	-webkit-box-align: center;
	-moz-box-align: center;
	box-align: center;
}

.VBox.vstart
{
	-webkit-box-pack: start;
	-moz-box-pack: start;
	box-pack: start;
}

.VBox.vend
{
	-webkit-box-pack: end;
	-moz-box-pack: end;
	box-pack: end;
}

.VBox.vcenter
{
	-webkit-box-pack: center;
	-moz-box-pack: center;
	box-pack: center;
}
